import React from 'react';
import { Card, Typography, Table, Tag, Space, Divider } from 'antd';
import { RiseOutlined, StarOutlined, FireOutlined } from '@ant-design/icons';

const { Title, Paragraph, Text } = Typography;

const StockPositioning: React.FC = () => {
  const cardStyle = {
    backgroundColor: '#112240',
    borderColor: '#233554',
    marginBottom: '20px',
  };
  
  const cardHeadStyle = {
    backgroundColor: '#112240',
    borderBottomColor: '#233554',
  };
  
  const cardBodyStyle = {
    backgroundColor: '#112240',
  };

  // 选股定位数据
  const positioningData = [
    {
      key: '1',
      category: '龙头定位',
      description: '行业或题材中的领先企业，具有较强的市场影响力和资金关注度',
      characteristics: ['成交量放大', '股价创新高', '基本面优秀', '机构持仓高'],
      examples: ['宁德时代', '比亚迪', '隆基绿能'],
      strategy: '跟随主力资金，波段操作，高抛低吸',
    },
    {
      key: '2',
      category: '潜力股定位',
      description: '具有成长潜力但尚未被市场充分认可的股票',
      characteristics: ['低估值', '业绩增长', '行业前景好', '股价处于底部区域'],
      examples: ['中微公司', '澜起科技', '寒武纪'],
      strategy: '提前布局，中长期持有，等待市场认可',
    },
    {
      key: '3',
      category: '题材股定位',
      description: '受益于特定政策、事件或市场热点的股票',
      characteristics: ['消息面活跃', '股价波动大', '成交量突增', '概念明确'],
      examples: ['东方财富', '中科曙光', '紫光国微'],
      strategy: '短线操作，快进快出，注重风险控制',
    },
    {
      key: '4',
      category: '价值股定位',
      description: '具有稳定业绩和良好分红的蓝筹股',
      characteristics: ['高ROE', '稳定分红', '行业地位稳固', '抗风险能力强'],
      examples: ['贵州茅台', '招商银行', '海康威视'],
      strategy: '长期持有，分红再投资，定投策略',
    },
    {
      key: '5',
      category: '反转股定位',
      description: '前期大幅下跌后出现企稳反转迹象的股票',
      characteristics: ['超跌', '成交量逐渐放大', '股价形成底部', '基本面改善'],
      examples: ['中国平安', '格力电器', '三一重工'],
      strategy: '等待确认信号，设置止损，逐步加仓',
    },
  ];

  const columns = [
    {
      title: '定位类别',
      dataIndex: 'category',
      key: 'category',
      render: (text: string) => (
        <span style={{ color: '#64ffda', fontWeight: 'bold' }}>
          {text}
        </span>
      ),
    },
    {
      title: '特征',
      dataIndex: 'characteristics',
      key: 'characteristics',
      render: (chars: string[]) => (
        <span>
          {chars.map(char => (
            <Tag color="#233554" key={char} style={{ margin: '2px' }}>
              {char}
            </Tag>
          ))}
        </span>
      ),
    },
    {
      title: '代表个股',
      dataIndex: 'examples',
      key: 'examples',
      render: (stocks: string[]) => (
        <Space>
          {stocks.map(stock => (
            <Text key={stock} style={{ color: '#8892b0' }}>{stock}</Text>
          ))}
        </Space>
      ),
    },
    {
      title: '操作策略',
      dataIndex: 'strategy',
      key: 'strategy',
      render: (text: string) => <span style={{ color: '#ccd6f6' }}>{text}</span>,
    },
  ];

  return (
    <div style={{ padding: '20px' }}>
      <Card 
        title="选股定位策略" 
        style={cardStyle}
        headStyle={cardHeadStyle}
        bodyStyle={cardBodyStyle}
      >
        <Typography style={{ color: '#ccd6f6', marginBottom: '20px' }}>
          <Paragraph>
            选股定位是交易系统中的关键环节，通过对不同类型股票的准确定位，可以制定相应的交易策略，提高交易成功率。
            以下是常见的选股定位类别及其特征、代表个股和操作策略。
          </Paragraph>
        </Typography>
        
        <Table 
          dataSource={positioningData} 
          columns={columns} 
          pagination={false}
          expandable={{
            expandedRowRender: record => (
              <p style={{ margin: 0, color: '#8892b0', padding: '10px 20px' }}>
                {record.description}
              </p>
            ),
          }}
          style={{ 
            backgroundColor: '#112240',
            color: '#ccd6f6'
          }}
        />

        <Divider style={{ borderColor: '#233554', margin: '30px 0 20px' }} />
        
        <Typography style={{ color: '#ccd6f6' }}>
          <Title level={4} style={{ color: '#64ffda' }}>选股定位核心原则</Title>
          <Paragraph>
            <ul>
              <li>明确市场环境：牛市选择高弹性，熊市选择低估值防御</li>
              <li>结合行业周期：顺周期行业选择处于上升期的龙头</li>
              <li>资金面分析：关注主力资金流向，避开资金流出严重的板块</li>
              <li>风险收益比：预期收益与可能风险的比例至少为2:1</li>
              <li>组合配置：不同定位的股票合理配置，分散风险</li>
            </ul>
          </Paragraph>
        </Typography>
      </Card>
    </div>
  );
};

export default StockPositioning;